<template>
	<a-drawer :title="dicPro.title" :width="720" :visible="dicPro.visible" :body-style="{ paddingBottom: '80px' }" @close="dicPro.onClose">
		<a-form :form="dicPro.form" layout="vertical" hide-required-mark>
			<a-row :gutter="16">
				<a-col :span="24">
					<a-form-item label="key">
						<a-input v-decorator="['key',{rules: [{ required: true, message: 'Please enter key' }]}]" placeholder="Please enter key" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isPassword">
				<a-col :span="12">
					<a-form-item label="密码">
						<a-input type="password" v-decorator="['password',{rules: [{ required: true, message: 'Please enter password' }]}]" placeholder="Please enter password" />
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="再次输入">
						<a-input type="password" v-decorator="['repeat',{rules: [{ required: true, message: 'Please repeat enter password' }]}]" placeholder="Please repeat enter password" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="!isMin">
				<a-col :span="24">
					<a-form-item label="Value">
						<a-textarea v-decorator="['value',{rules: [{ required: true, message: 'Please enter value' }]}]" :rows="row" placeholder="please enter value" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isPic">
				<a-col :span="24">
					<a-form-item label="Pics">
						<a-textarea v-decorator="['pics',{rules: [{ required: true, message: 'Please enter pics' }]}]" :rows="row" placeholder="please enter pics" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isDesc">
				<a-col :span="24">
					<a-form-item label="Desc">
						<a-textarea v-decorator="['desc',{rules: [{ required: true, message: 'Please enter desc' }]}]" :rows="row" placeholder="please enter desc" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="minName">
						<a-input v-decorator="['minName',{rules: [{ required: false, message: 'Please enter minName' }]}]" placeholder="Please enter minName" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="minType">
						<a-input v-decorator="['minType',{rules: [{ required: false, message: 'Please enter minType' }]}]" placeholder="Please enter minType" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="minKey">
						<a-textarea v-decorator="['minKey',{rules: [{ required: false, message: 'Please enter minKey' }]}]" :rows="row" placeholder="please enter minKey" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="menus">
						<a-textarea v-decorator="['menus',{rules: [{ required: false, message: 'Please enter menus' }]}]" :rows="row" placeholder="please enter menus" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="hot">
						<a-textarea v-decorator="['hot',{rules: [{ required: false, message: 'Please enter hot' }]}]" :rows="row" placeholder="please enter hot" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="all">
						<a-textarea v-decorator="['all',{rules: [{ required: false, message: 'Please enter all' }]}]" :rows="row" placeholder="please enter all" />
					</a-form-item>
				</a-col>
			</a-row>
			<a-row :gutter="16" v-if="isMin">
				<a-col :span="24">
					<a-form-item label="params">
						<a-textarea v-decorator="['params',{rules: [{ required: false, message: 'Please enter params' }]}]" :rows="row" placeholder="please enter params" />
					</a-form-item>
				</a-col>
			</a-row>
		</a-form>
		<div class="drawer-end" >
			<a-button :style="{marginRight:'8px'}" @click="dicPro.onClose">取消</a-button>
			<a-button type="primary" @click="save" :loading="loading">提交</a-button>
		</div>
	</a-drawer>
</template>

<script>
export default {
		name: 'IvzKeyFormView',
		props: {
				dicPro: {type: Object, required: true},
				isPassword: {type: Boolean, required: false},
				isPic: {type: Boolean, required: false},
				isDesc: {type: Boolean, required: false},
				isMin: {type: Boolean, required: false},
				row: {type: Number, required: false, default:8}
		},
		data () {
			return {
				loading:false
			}
		},
		created() {
			this.dicPro["form"] = this.$form.createForm(this)
		},
		methods: {
			save(){
				this.loading = true;
				if(typeof this.dicPro.onSave === "function"){
					this.dicPro.onSave.call(this, this.dicPro);
				}
				setTimeout(()=>{
					this.loading = false;
				}, 2000);
			}
		}
}
</script>

<style>

</style>
